/* normalize.css */
/**
 * 1. 设置默认字体大小和行高为 1 
 * 2. 使用 border-box 盒模型 
 * 3. 删除 marging 和 padding 
 */
html {
  font-size: 62.5%;
  line-height: 1;
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}

/**
 * 删除列表样式 
 */
ul, ol, li {
  list-style: none;
}

/**
 * 下面实现了更灵活的图像显示方式，
 * 甚至不改变默认的外观和尺寸样式！
 *
 * 1. 创建路径的文本节点
 * 2. 为替换元素（如 img、替换的文本）设置 max-width: 100%
 * 3. 使用 vertical-align: middle 避免图像在行中移动
 *
 * 您还可以添加反比例伸缩值（如 max-width：200%），
 * 以使图像可简单地超出其父容器。
 */
img {
  display: inline-block;
  max-width: 100%;
  vertical-align: middle;
}

/**
 * HTML5 元素和属性的书写规范化
 */
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary,
[hidden], [data-*] {
  display: block;
}

/**
 * 1. 修改字体样式链接，使其在各个浏览器中一致 
 * 2. 设置所有可访问元素的外观为游标 
 */
a {
  color: inherit;
  text-decoration: none;
}
a[href^="tel:"] {
  color: inherit;
  text-decoration: none;
  cursor: tel;
}
a[href^="mailto:"] {
  color: inherit;
  text-decoration: none;
  cursor: email;
}
a[href^="http://"], a[href^="https://"] {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}